<!DOCTYPE html>
<html lang="en">

<head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>锤子商城-周洪民-购物车</title>
   <link rel="stylesheet" href="/css/buyShop.css">
</head>

<body>
   <header></header>
   <main>
      <div class="page-cart">
         <div class="page-cart-title">
            <h2>购物清单</h2>
         </div>
         <!-- 没有商品时显示没这个 -->
         <div class="empty">
            <p>您的购物车内还没有商品</p>
            <a href="/index.html">现在选购 </a>
         </div>
         <table class="page-cart-list" id="cart">
            <thead>
               <th>商品信息</th>
               <th>单价</th>
               <th>数量</th>
               <th>小计</th>
               <th>操作</th>
            </thead>
            <tbody id="tbody">

            </tbody>
         </table>
         <script type="text/html" id="tbodyTemplate">
            {{each cart shop}}
            <!-- 一件物品 -->
            <tr data-id='{{shop.id}}'>
               <td class="content">
                  <input type="checkbox" {{shop.check ? 'checked' : ''}} class='check'>
                  <a href="/html/detailsPage.html?id={{shop.id}}"><img src="{{shop.img}}" alt=""></a>
                  <h2>{{shop.title}}</h2>
                  <h5>{{shop.color}}</h5>
               </td>
               <td>
                  <h3>{{shop.price}}</h3>
               </td>
               <td class='noText'>
                  <span class="btn sub">
                     -
                  </span>
                  <input type="text" class="num" value="{{shop.count}}">
                  <span class="btn add">
                     +
                  </span>
               </td>
               <td>
                  <span class="price">{{(shop.price*shop.count).toFixed(2)}}</span>
               </td>
               <td>
                  <span class="btn del">
                     ×
                  </span>
               </td>
            </tr>
            {{/each}}
         </script>
         <!-- 购买物品 -->
         <div class="buy" id="buy">
            
         </div>
         <script type="text/html" id="buyTemplate">
            <div class="buy-left">
               <input type="checkbox" name="" id="allCheck">
               <span>全选</span>
               <span>|</span>
               <!-- <span>删除选中的商品</span> -->
            </div>
            <div class="buy-right">
               <div>已选择
             
                  <h2 id='allNum'>
                    0
                  </h2>
                  件商品 <p>|</p> 应付总额:<h3 id='allPrice'>￥ 566.00</h3>
               </div>
               <button>现在结算</button>
            </div>
         </script>
      </div>
   </main>
   <footer></footer>
   <script src="/libs/require.js" data-main="/js/buyShop"></script>
</body>

</html>